<template>
  <div class="addgoods">
    <el-form ref="goods" :model="goods" label-width="120px">
      <el-form-item label="商品名称">
        <el-input v-model="goods.title" placeholder="请输入商品名称"></el-input>
      </el-form-item>
      <el-form-item label="封面">
        <el-button
          icon="el-icon-plus"
          @click="addImgform = true"
          v-if="goods.avatar == ''"
        ></el-button>
        <el-image :src="goods.avatar" v-else />
      </el-form-item>
      <el-form-item label="商品分类">
        <el-select v-model="goods.category_id" placeholder="请选择商品分类">
          <el-option :value="item.id" v-for="item in cateList" :key="item.id" :label="item.name"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="商品描述">
        <el-input
          type="textarea"
          :rows="2"
          placeholder="请输入商品描述"
          v-model="goods.desc"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="商品单位">
        <el-input v-model="goods.unit" placeholder="请输入商品单位"></el-input>
      </el-form-item>
      <el-form-item label="总库存">
        <el-input v-model="goods.stock">
          <el-button slot="append">件</el-button>
        </el-input>
      </el-form-item>
      <el-form-item label="库存预警">
        <el-input v-model="goods.min_stock">
          <el-button slot="append">件</el-button>
        </el-input>
      </el-form-item>
      <el-form-item label="最低销售价">
        <el-input v-model="goods.min_price">
          <el-button slot="append">元</el-button>
        </el-input>
      </el-form-item>
      <el-form-item label="最低原价">
        <el-input v-model="goods.min_oprice">
          <el-button slot="append">元</el-button>
        </el-input>
      </el-form-item>
      <el-form-item label="库存显示">
        <el-radio v-model="goods.stock_display" type="success" :label="1" border
          >是</el-radio
        >
        <el-radio v-model="goods.stock_display" type="danger" :label="0" border
          >否</el-radio
        >
      </el-form-item>
      <el-form-item label="是否上架">
        <el-radio v-model="goods.ischeck" type="danger" :label="1" border
          >放入仓库</el-radio
        >
        <el-radio v-model="goods.ischeck" type="success" :label="0" border
          >立即上架</el-radio
        >
      </el-form-item>
      <el-form-item label="运费模板">
        <el-select v-model="goods.express_id" placeholder="请选择运费模板">
          <el-option :value="item.id" v-for="item in express" :key="item.id" :label="item.name"></el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <el-button type="success" @click="addGoods">确定</el-button>
    <!-- 添加头像的模态框 -->
    <setImg @img="img" :addImgform="addImgform"></setImg>
    <!-- <setImg :set_img="flag" @close="()=>{flag=false;}" @comfirm="comfirm"></setImg> -->
  </div>
</template>

<script>
import setImg from "../common/setImg";
export default {
  components: { setImg },
  data() {
    return {
      addImgform: false,
      goods: {
        cover: "",
        category_id: "",
        title: "",
        express_id: "",
        desc: "",
        unit: "",
        stock: "",
        min_stock: "",
        min_price: "",
        min_oprice: "",
        status: "0",
        stock_display: "0",
        ischeck: 0,
        avatar: "",
      },
      // 商品分类
      cateList:[],
      // 运费模板
      express:[],
    };
  },
  created() {},
  mounted() {
    this.$axios.get('/admin/goods/create').then((res)=>{
      console.log(res)
      // 商品分类
      this.cateList = res.data.cates;
      // 运费模板
      this.express = res.data.express.list;
    });
    
  },
  methods: {
    img(url) {
      // alert(url);
      this.addImgform = false;
      this.goods.avatar = url;
    },
    // 添加
    addGoods(){
      this.$axios.post('/admin/goods',this.goods).then((res)=>{
        console.log(res)
        if(res.msg == 'ok'){
          this.$message.success('发布成功')
        }
        this.$router.push('/goodslist')
      })
    }
  },
  computed: {},
};
</script>

<style scoped>
.el-image{
  width: 60px;
  height: 60px;
}
</style>
